<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta name="description" content="">
    <meta name="author" content="">

    <link rel="shortcut icon" href="<!--{eval echo register_static('img/touch-icon-57x57.png');}-->">

    <title>粉粉管理系统</title>

    <!-- Bootstrap core CSS -->
    <link href="<!--{eval echo register_static('css/bootstrap.min.css');}-->" rel="stylesheet">
    <link href="<!--{eval echo register_static('css/bootstrap-reset.css');}-->" rel="stylesheet">

    <!--Animation css-->
    <link href="<!--{eval echo register_static('css/animate.css');}-->" rel="stylesheet">

    <!--Icon-fonts css-->
    <link href="<!--{eval echo register_static('assets/font-awesome/css/font-awesome.css');}-->" rel="stylesheet" />
    <link href="<!--{eval echo register_static('assets/ionicon/css/ionicons.min.css');}-->" rel="stylesheet" />

    <link href="<!--{eval echo register_static('assets/sweet-alert/sweet-alert.min.css');}-->" rel="stylesheet">

    <!-- Plugins css -->
    <link href="<!--{eval echo register_static('assets/modal-effect/css/component.css');}-->" rel="stylesheet">

    <!-- DataTables -->
    <link rel="stylesheet" href="<!--{eval echo register_static('assets/datatables/jquery.dataTables.min.css" rel="stylesheet');}-->" />

    <!-- Custom styles for this template -->
    <link href="<!--{eval echo register_static('css/style.css');}-->" rel="stylesheet">
    <link href="<!--{eval echo register_static('css/helper.css');}-->" rel="stylesheet">

    <!-- My styles for this template -->
    <link href="<!--{eval echo register_static('css/common.css');}-->" rel="stylesheet">
    <link href="<!--{eval echo register_static('assets/timepicker/bootstrap-timepicker.min.css');}-->" rel="stylesheet">
    <link href="<!--{eval echo register_static('assets/timepicker/bootstrap-datepicker.min.css');}-->" rel="stylesheet">


</head>

<body id="mybody">

<!-- Aside Start-->
<!--{template admin_v2/leftside}-->
<!-- Aside Ends-->


<!--Main Content Start -->
<section class="content">

    <!-- Header -->
    <!--{template admin_v2/header}-->
    <!-- Header Ends -->


    <!-- Page Content Start -->
    <!-- ================== -->

    <div class="wraper container-fluid diary-topics">

        <div class="row">
            <div class="col-md-12">
                <div class="panel panel-default" style="overflow: auto;">
                    <div class="panel-heading">
                        <h3 class="panel-title">匿名话题定时上线</h3>
                    </div>
                    <div class="panel-body">
                        <div class="row" style="margin-bottom: 10px">
                            <div class="col-md-9 col-sm-9 col-xs-9">
                                <!-- Search -->
                                <div class="form-inline">
                                    <div class="form-group pageCon">

                                    </div>
                                </div>
                            </div>
                            <div class="col-md-3 col-sm-3 col-xs-3">
                                <button class="btn btn-info myAdd"><i class="ion-plus-round"></i> 查找bodyId</button>
                                <button class="btn btn-success myNew"><i class="ion-edit"></i> 发匿名</button>
                            </div>
                        </div>
                        <div class="row">
                            <div class="col-md-12 col-sm-12 col-xs-12">
                                <table id="datatable" class="table table-striped table-bordered table-hover">
                                    <thead>
                                    <tr>
                                        <th width="5%">bodyId</th>
                                        <th>标题</th>
                                        <th width="30%">内容</th>
                                        <th>背景</th>
                                        <th>uid</th>
                                        <th>创建于</th>
                                        <th>发布时间</th>
                                        <th>操作</th>
                                    </tr>
                                    </thead>

                                    <tbody id="tbody">

                                    </tbody>
                                </table>
                            </div>
                        </div>
                        <div class="row" style="margin-top: 15px">
                            <div class="form-group pageCon"></div>
                        </div>
                    </div>
                </div>
            </div>
        </div>

    </div>
    <!-- Page Content Ends -->
    <!-- ================== -->

    <div id="con-close-modal" class="modal fade" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true" style="display: none;">

    </div><!-- /.modal -->


    <!-- Footer Start -->
    <!--{template admin_v2/footer}-->
    <!-- Footer Ends -->



</section>
<!-- Main Content Ends -->

<!--template start-->
<script type="text/template" id="tableCon">
    {{#.}}
    <tr>
        <td><label class="label label-success">{{{bodyId}}}</label></td>
        <td><span style="color: #7E3D76">{{{title}}}</span></td>
        <td><span style="color: #FF5809">{{{content}}}</span></td>
        <td><img src="{{{bg_value}}}" width="100" class="showImg" /></td>
        <td>{{{uid}}}</td>
        <td><label class="label label-info">{{{dateConv create_at}}}</label></td>
        <td><label class="label label-info">{{{uptime}}}点</label></td>
        <td>
            <div class="btn-group btn-group-sm">
                <button type="button" class="btn btn-danger myDelete" data-id="{{{bodyId}}}" data-uid="{{{uid}}}">删除</button>
                <a href="admin.php?ac=commentary&op=commentOnlineList&bodyId={{{bodyId}}}&uid={{{uid}}}">
                    <!--myDiscuss-->
                    <button type="button" class="btn btn-info " data-id="{{{bodyId}}}" data-uid="{{{uid}}}" style="height:30px">评论列表 ({{{comment}}})</button>
                </a>
                <button type="button" class="btn btn-danger myEdit" data-id="{{{bodyId}}}">编辑</button>
            </div>
        </td>
    </tr>
    {{/.}}
</script>

<script type="text/template" id="editModal">
    {{#.}}
    <form>
        <div>
            <table class="table table-bordered">
                <thead>
                <tr>
                    <th width="25%">类别</th>
                    <th width="75%">内容</th>
                </tr>
                </thead>
                <tbody>
                <tr>
                    <td>标题</td>
                    <td >
                        <div class="form-inline">
                            <div class="form-group">
                                <input type="text" id="title" class="form-control"  placeholder="匿名的标题" value="{{{title}}}">
                            </div>
                        </div>
                    </td>
                </tr>
                <tr>
                    <td>内容</td>
                    <td >
                        <textarea class="form-control" rows="3" id="content" placeholder="匿名的内容">{{{content}}}</textarea>
                    </td>
                </tr>
                <tr>
                    <td>背景图片链接</td>
                    <td>
                        <textarea class="form-control" rows="3" id="bg_value">{{{bg_value}}}</textarea>
                    </td>
                </tr>
                <tr>
                    <td>操作</td>
                    <td style="text-align: center">
                        <button type="button" class="btn btn-info myEditPost" data-bodyid="{{{bodyId}}}" data-uid="{{{uid}}}" data-bgtype="image">完成</button>
                    </td>
                </tr>
                </tbody>
            </table>
        </div>
    </form>
    {{/.}}
</script>

<script type="text/template" id="addModal">
    <form>
        <div>
            <table class="table table-bordered">
                <thead>
                <tr>
                    <th width="25%">类别</th>
                    <th width="75%">内容</th>
                </tr>
                </thead>
                <tbody>
                <tr>
                    <td>bodyId</td>
                    <td >
                        <div class="form-inline">
                            <div class="form-group">
                                <input type="text" name="id" class="form-control"  placeholder="" value="" style="width: 170px">
                            </div>
                        </div>
                    </td>
                </tr>
                <tr>
                    <td>操作</td>
                    <td style="text-align: center">
                        <button type="button" class="btn btn-info mySortPost">确定</button>
                    </td>
                </tr>
                </tbody>
            </table>
        </div>
    </form>
</script>

<script type="text/template" id="newModal">
    <form>
        <div>
            <table class="table table-bordered">
                <thead>
                <tr>
                    <th width="25%">类别</th>
                    <th width="75%">内容</th>
                </tr>
                </thead>
                <tbody>
                <tr>
                    <td>uid</td>
                    <td >
                        <div class="form-inline">
                            <div class="form-group">
                                <input type="text" name="uid" class="form-control"  placeholder="输入有效的用户uid" value="" style="width: 170px">
                            </div>
                        </div>
                    </td>
                </tr>
				<tr>
                    <td>标题</td>
                    <td >
                        <div class="form-inline">
                            <div class="form-group">
                                <input type="text" name="title" class="form-control"  placeholder="匿名的标题" value="" style="width: 170px">
                            </div>
                        </div>
                    </td>
                </tr>
                <tr>
                    <td>内容</td>
                    <td >
                        <div class="form-inline">
                            <div class="form-group">
                                <textarea class="form-control" rows="3" name="content" placeholder="匿名的内容" style="width: 280px"></textarea>
                            </div>
                        </div>
                    </td>
                </tr>
                <tr>
                    <td>上线时间</td>
                    <td >
                        <div class="form-inline">
                            <select style="height: 26px;" name="onlineTime">
                                <option value="20">20:00</option>
                                <option value="21">21:00</option>
                            </select>
                        </div>
                    </td>
                </tr>
                <tr>
                    <td>背景类型</td>
                    <td >
                        <select style="height: 26px;" name="bg_type">
                            {{{anonymousBgTypeSelect 'color'}}}
                        </select>
                    </td>
                </tr>
                <tr class="bgvalue1">
                    <td>颜色值</td>
                    <td >
                        <div class="form-inline">
                            <div class="form-group">
                                <input type="text" name="bg_value1" class="form-control colorpicker-component"  placeholder="颜色值,如#555555" value="" style="width: 170px">
                            </div>
                        </div>
                    </td>
                </tr>
                <tr class="bgvalue2" style="display: none">
                    <td>图片地址</td>
                    <td >
                        <div class="form-inline">
                            <div class="form-group">
                                <input type="text" name="bg_value2" id="bg_value2" class="form-control"  placeholder="图片地址" value="" style="width: 250px">
                            </div>
                        </div>
                    </td>
                </tr>
                <tr>
                    <td>操作</td>
                    <td style="text-align: center">
                        <button type="button" class="btn btn-info myNewPost">确定</button>
                    </td>
                </tr>
                </tbody>
            </table>
        </div>
    </form>
</script>


<script type="text/template" id="flushDayModal">
    <form>
        <div>
            <table class="table table-bordered">
                <thead>
                <tr>
                    <th width="25%">类别</th>
                    <th width="75%">内容</th>
                </tr>
                </thead>
                <tbody>
                <tr>
                    <td>选择日期</td>
                    <td >
                        <div class="form-inline">
                            <div class="form-group">
                                <input type="text" name="day" class="form-control timepicker3"  placeholder="" value="" style="width: 200px">
                            </div>
                        </div>
                    </td>
                </tr>
                <tr>
                    <td>操作</td>
                    <td style="text-align: center">
                        <button type="button" class="btn btn-info myFlushDayPost">确定</button>
                    </td>
                </tr>
                </tbody>
            </table>
        </div>
    </form>
</script>

<script type="text/template" id="disListModal">
    {{#.}}
    <tr>
        <th>{{{position}}}</th>
        <th>{{{uid}}}</th>
        <th>{{{content}}}</th>
        <th><button type="button" class="btn btn-danger myDelPos" data-cid="{{{cid}}}" data-pos="{{{position}}}" data-uid="{{{uid}}}">删除</button></th>
    </tr>
    {{/.}}
</script>
<!--template end-->


<!-- js placed at the end of the document so the pages load faster -->
<script src="<!--{eval echo register_static('js/jquery.js');}-->"></script>
<script src="<!--{eval echo register_static('js/bootstrap.min.js');}-->"></script>
<script src="<!--{eval echo register_static('js/pace.min.js');}-->"></script>
<script src="<!--{eval echo register_static('js/wow.min.js');}-->"></script>
<script src="<!--{eval echo register_static('js/jquery.nicescroll.js');}-->" type="text/javascript"></script>
<script src="<!--{eval echo register_static('js/jquery.app.js');}-->"></script>

<script src="<!--{eval echo register_static('js/handlebars-v4.0.5.js');}-->"></script>
<script src="<!--{eval echo register_static('js/handlebars-helper.js');}-->"></script>
<script src="<!--{eval echo register_static('layer/layer.js');}-->"></script>
<script src="<!--{eval echo register_static('laypage/laypage.js');}-->"></script>
<script src="<!--{eval echo register_static('laydate/laydate.js');}-->"></script>

<script src="<!--{eval echo register_static('assets/datatables/jquery.dataTables.min.js');}-->"></script>
<script src="<!--{eval echo register_static('assets/datatables/dataTables.bootstrap.js');}-->"></script>
<script src="<!--{eval echo register_static('assets/sweet-alert/sweet-alert.min.js');}-->"></script>
<script src="<!--{eval echo register_static('assets/sweet-alert/sweet-alert.init.js');}-->"></script>

<!-- Modal-Effect -->
<script src="<!--{eval echo register_static('assets/modal-effect/js/classie.js');}-->"></script>
<script src="<!--{eval echo register_static('assets/modal-effect/js/modalEffects.js');}-->"></script>
<script src="//cdn.bootcss.com/tinyColorPicker/1.1.1/jqColorPicker.js"></script>

<script type="text/javascript">
    $(document).ready(function() {

        //编译模板
        var tp_tableCon = Handlebars.compile($('#tableCon').html());
        var tp_editModal = Handlebars.compile($('#editModal').html());
        var tp_addModal = Handlebars.compile($('#addModal').html());
        var tp_newModal = Handlebars.compile($('#newModal').html());

        $('.myChoose').change(function () {
            _Where_.page = 1;
            var name = $(this).attr('name');
            switch (name){
                case 'type':
                    $(this).val() != 'no' ?  _Where_.type = $(this).val() : _Where_.type = undefined;
                    break;
                case 'face':
                    $(this).val() != 'no' ?  _Where_.face = $(this).val() : _Where_.face = undefined;
                    break;
            }
            RequestList();
        });

        $('.myAdd').click(function () {
            var html = tp_addModal();
            layer.open({
                type: 1,
                title: '删除指定bodyId',
                closeBtn: 1,
                area:['320px', '250px'],
                shadeClose: true,
                content: html
            });
        });

        $('.myNew').click(function () {
            var html = tp_newModal();
            layer.open({
                type: 1,
                title: '发布匿名',
                closeBtn: 1,
                area:['400px', '550px'],
                shadeClose: true,
                content: html
            });
        });

        $(document).off('click', '.myNewPost').on('click', '.myNewPost', function () {
            var form = $(this).parents('form');
            var params = {};
            params.uid = form.find('input[name="uid"]').val();
            params.title = form.find('input[name="title"]').val();
            params.content = form.find('textarea').val();
            params.onlineTime = form.find('select[name="onlineTime"]').find("option:selected").val();
            params.bg_type = form.find('select[name="bg_type"]').find("option:selected").val();
            params.bg_value = params.bg_type=='color' ? form.find('input[name="bg_value1"]').val() : form.find('input[name="bg_value2"]').val();
            layer.confirm('确定添加该匿名？', {icon: 3, title:'提示'}, function(i){
                var index = layer.load();
                $.post(
                    '/admin.php?ac=anonymous&op=addOnline',
                    params,
                    function (r) {
                        if (r._code == 1){
                            window.location = location.href;
                        }else{
                            layer.msg('没有这条数据', {icon: 0});
                        }
                        layer.closeAll();
                    }
                );
            });
        });

        $(document).off('click', '.myDelPos').on('click', '.myDelPos', function () {
            var bodyid = $(this).data('cid');
            var pos = $(this).data('pos');
            var uid = $(this).data('uid');
            var _this =　$(this);
            var index = layer.load();
            $.post(
                '/admin.php?ac=anonymous&op=disdel',
                {bodyId:bodyid, pos:pos, uid:uid},
                function (r) {
                    layer.close(index);
                    if (r._code == 1){
                        _this.parents('tr').remove();
                    }else{
                        layer.msg('删除失败', {icon: 0});
                    }
                }
            );
        });

        $(document).off('change', 'form select[name="bg_type"]').on('change', 'form select[name="bg_type"]', function () {
            var val = $(this).find("option:selected").val();
            var form = $(this).parents('form');
            if (val=='color'){
                $('.bgvalue1').show();
                $('.bgvalue2').hide();
            }else{
                $('.bgvalue2').show();
                $('.bgvalue1').hide();
//                var bgimg = "http://www.ffrj.com";  //默认背景图片
//                var bgvalue2 = $('#bg_value2').val(bgimg);
            }
        });

        $(document).off('click', '.mySortPost').on('click', '.mySortPost', function () {
            var bodyId = $(this).parents('form').find('input[name="id"]').val();
            if (!bodyId)return ;
            var index = layer.load();
            $.post(
                '/admin.php?ac=anonymous&op=detailOnline',
                {id:bodyId},
                function (r) {
                    if (r._code == 1){
                        var html = tp_tableCon(r.result);
                        $('#tbody').html(html);
                    }else{
                        layer.msg('没有这条数据', {icon: 0});
                    }
                    layer.closeAll();
                }
            );
        });

        $(document).off('click', '.myDelete').on('click', '.myDelete', function () {
            var id = $(this).data('id');
            var uid = $(this).data('uid');
            var _this = $(this);
            layer.confirm('确定删除 bodyId:'+id+'？', {icon: 3, title:'提示'}, function(i){
                var index = layer.load();
                $.post(
                    '/admin.php?ac=anonymous&op=delOnline&id=' + id + '&uid='+uid ,
                    function (r) {
                        layer.close(index);
                        if(r._code == 1){
                            layer.closeAll();
                            _this.parents('tr').remove();
                            layer.msg('已删除', {icon: 1});
                        }else{
                            layer.msg(r._msg, {icon: 0});
                        }
                    }
                );
            });
        });

        $(document).off('click', '.myEdit').on('click', '.myEdit', function () {
            var bodyid = $(this).data('id');
            var index = layer.load();
            $.post(
                '/admin.php?ac=anonymous&op=detailOnline',
                {id:bodyid},
                function (r) {
                    layer.close(index);
                    if(r._code == 1){
                        var html = tp_editModal(r.result);
                        layer.open({
                            type: 1,
                            title: '修改信息',
                            closeBtn: 1,
                            area:['25%', '60%'],
                            shadeClose: true,
                            content: html
                        });
                    }else{
                        layer.msg(r._msg, {icon: 0});
                    }
                }
            );
        });

        $(document).off('click', '.myEditPost').on('click', '.myEditPost', function () {
            var params = {};
            params.title = $('#title').val();
            params.content = $('#content').val();
            params.bodyId = $(this).data('bodyid');
            params.bg_type = $(this).data('bgtype');
            params.bg_value = $('#bg_value').val();
            params.uid = $(this).data('uid');
            $.post(
                '/admin.php?ac=anonymous&op=editOnline',
                params,
                function (r) {
                    if (r._code == 1){
                        window.location = location.href;
                    }else{
                        layer.msg('更新失败', {icon: 0});
                    }
                    layer.closeAll();
                }
            );

        });

        $(document).off('click', '.showImg').on('click', '.showImg', function () {
            layer.tips('<img src="'+$(this).attr('src')+'" />', $(this), {
                tips: [2, '#fff'],
            });
        });

        _Where_ = {page:1};
        //请求数据列表数据
        var RequestList = function () {
            where = _Where_;
            if(typeof where == 'undefined')where = {};
            var index = layer.load();
            $.post(
                '/admin.php?ac=anonymous&op=onlinelist',
                where,
                function (r) {
                    if (r._code == 1){
//                        htmlStr(r.result);
                        var html = tp_tableCon(r.result);
                        $('#tbody').html(html);
                        laypage({
                            cont: $('.pageCon'), //容器。值支持id名、原生dom对象，jquery对象。【如该容器为】：<div id="page1"></div>
                            pages: 100, //通过后台拿到的总页数
                            curr: _Where_.page || 1, //当前页
                            jump: function(obj, first){ //触发分页后的回调
                                if(!first){ //点击跳页触发函数自身，并传递当前页：obj.curr
                                    _Where_.page = obj.curr;
                                    RequestList();
                                }
                            }
                        });
                    }else{
                        layer.msg('没有更多了', {icon: 0});
                    }
                    layer.close(index);
                }
            );
        }
        RequestList();
//        function htmlStr(r) {
//            alert(r);return;
//        }

    });
</script>
</body>
</html>
